<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <button type="button" id="cookie">测试cookie按钮</button>
    <button type="button" id="sessionStorage">sessionStorage</button>
    <button type="button" id="localStorage">测试localStorage按钮</button>
</head>
<body>
<script>
    onload=()=> {
        //cookie操作
        document.querySelector('#cookie').onclick = () => {
            //设置一个过期日期
            let now = new Date();
            now.setDate(now.getDate() + 3);
            //添加一个cookie值
            document.cookie=`name=lyy;expires=${now}`;
            document.cookie=`age=18;expires=${now}`;
            //同名覆盖
            document.cookie=`name=zzx;expires=${now}`;
            //查看所以cookie值
            console.log('cookie',document.cookie);
            //将cookie设置为session级别
            document.cookie=`age=18;expires=-1`;
            console.log('cookie',document.cookie);

            //测试sessionStorage('k','v'),k是键值，v是要存放的实际数据
            //k可以是数字，也可以是字符串
            //只能存字符串，要存JSON的话得把JSON序列化
            //通过键值来存储和删除数据
            sessionStorage.setItem('name','liuguang');
            console.log(sessionStorage.getItem('name'));

            //测试localStorage('k','v'),k是键值，v是要存放的实际数据
            //只能存字符串，要存JSON的话得把JSON序列化
            localStorage.setItem('name','liangyaoyun');
            console.log(localStorage.getItem('name'));
            //单删
            localStorage.removeItem();
            //全删
            localStorage.clear();

        }
    }
</script>
</body>
</html>